import React from 'react';
import { observer, inject } from 'mobx-react';
import { getAntd,getEcCom,getLabel } from '../../util/convert';
import * as _ from '../../util/public/common';
import * as API_REQ from '../../apis/req';
import { buildUrlStr } from '../../util/formUtil';
import * as FieldUtil from '../../util/public/fieldUtil';

//流程编号
@inject('globalStore', 'layoutStore')
@observer
export default class WeaWfCode extends React.Component {
	constructor(props) {
		super(props);
    	this.state = {
          canSaveFlag: true,
          canChoiceFlag: true,
          canAddFlag: true,
    	}
  }
    doChangeEvent = (e) => {
        const value = e.target.value;
        const { layoutStore,fieldMark } = this.props;
		layoutStore.changeSingleFieldValue(fieldMark, {value: value});
    }
	render() {
        const { Button } = getAntd();
        const { globalStore,layoutStore } = this.props;
        const { commonParam,urlParams } = globalStore;
        const { iscreate } = commonParam;
        const { codeInfo } = layoutStore;
        const { codefields,hasHistoryCode } = codeInfo;
        const { fieldMark,fieldAttr,symbol,fieldObj } = this.props;
        let { baseProps } = this.props;
        const { value,viewAttr } = baseProps;
		const isShowBtn = !hasHistoryCode && iscreate != "1" && !commonParam.belongTest && urlParams.isPreView !== "1";
		if(viewAttr === 1){
			return <span>
				<span dangerouslySetInnerHTML={{__html: value}}></span>
				<input type="hidden" id={fieldMark} name={fieldMark} value={value} />
			</span>
		}else{
            const isRequired = viewAttr === 3 && _.trim(value).length === 0;
            const minWidth = isShowBtn ? "250px" : "60px";
			return (
                <div className="wf-code wf-form-input">
                    <input className="wf-input wf-input-main" style={{minWidth:minWidth}} value={value} type="text" onChange={this.doChangeEvent} onBlur={this.changeCode} />
                    <span id={`${fieldMark}span`} className="wf-input-required">
                        {isRequired ? <img src="/images/BacoError_wev9.png" align="absmiddle" /> : ""}
                    </span>
                    {isShowBtn && 
                        <div style={{marginTop:"5px"}}>
                            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@xt2czr`} size = "small" onClick={this.generateCode}>{getLabel(22784,'重新生成编号')}</Button>
                            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@d2xasp`} size = "small" onClick={this.chooseReservedCode}>{getLabel(22785,'选择预留号')}</Button>
                            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@jidk5r`} size = "small" onClick={this.newReservedCode}>{getLabel(22783,'新建预留号')}</Button>
                        </div>
                    }
                    <input type="hidden" id={fieldMark} name={fieldMark} value={value}/>
			    </div>
            )
		}
    }
    getRelateParams(){
        const { globalStore,layoutStore } = this.props;
        const { codeInfo } = layoutStore;
        const { codefields } = codeInfo;
        const { baseParam,commonParam } = globalStore;
        const params = {...baseParam, ...{creater:commonParam.creater, creatertype:commonParam.creatertype}};
        codefields && codefields.map(field =>{
            const fieldid = `${field.split("_")[0]}`;
            params["field"+fieldid] = FieldUtil.getRelateFieldValue(fieldid, -1);
        });
        return params;
    }
	generateCode = () => {
        const { layoutStore,fieldMark } = this.props;
        const { canSaveFlag } = this.state;
        let params = this.getRelateParams();
        params.operation = "CreateCodeAgain";
        if(!canSaveFlag) return 
        this.setState({canSaveFlag: false});
        API_REQ.createWfCode(params).then(data =>{
            const codeValue = data.wfcode;
            layoutStore.changeSingleFieldValue(fieldMark, {value: codeValue});
            this.syncTitleRequestMark(codeValue);
            this.setState({canSaveFlag: true});
		    });
    }
    
    changeCode = (e) => {
        const { fieldMark } = this.props;
        const value = e.target.value;
        let params = this.getRelateParams();
        params.operation = "ChangeCode";
        params.returnCodeStr = value;
		API_REQ.createWfCode(params).then(data =>{
            const codeValue = data.wfcode;
            this.syncTitleRequestMark(codeValue);
		});
    }

	chooseReservedCode = () => {
        const { WeaTools } = getEcCom();
        const { layoutStore,fieldMark } = this.props;
        const { canChoiceFlag } = this.state;
        let params = this.getRelateParams();
        const { workflowid,formid,isbill } = params;
        if(!canChoiceFlag) return;
        this.setState({canChoiceFlag: false}); 
		API_REQ.loadWfCodeFieldValueInfo(params).then(data =>{
            let chooseParams = {...data, ...{isRoute:true, isFromForm:1, workflowId:workflowid}};
            let url = `/spa/workflow/static4engine/engine.html#/main/workflowengine/path/codeMaintenance/reserveCode?${buildUrlStr(chooseParams)}`;
            const dialog = WeaTools.createDialog({
                title: getLabel(22785,'选择预留号'),
                moduleName: "workflow",
                url: url,
                style: {width:800, height:600},
                callback: (con) =>{
                    params.codeSeqReservedIdAndCode = con.id+"~~wfcodecon~~"+con.reservedCode;
                    params.operation = "chooseReservedCode";
                    API_REQ.createWfCode(params).then(data =>{
                        const codeValue = data.wfcode;
                        layoutStore.changeSingleFieldValue(fieldMark, {value: codeValue});
                        this.syncTitleRequestMark(codeValue);
                    });
                },
                onCancel: () =>{
                }
            });
            dialog.show();
            this.setState({canChoiceFlag: true});
		});
	}
	newReservedCode = () => {
        const { WeaTools } = getEcCom();
        const { fieldMark } = this.props;
        const { canAddFlag } = this.state;
        let params = this.getRelateParams();
        const { workflowid,formid,isbill } = params;
        if(!canAddFlag) return;
        this.setState({canAddFlag: false});
		API_REQ.loadWfCodeFieldValueInfo(params).then(data =>{
            let createParams = {...params, ...data, ...{isRoute:true, isFromForm:1, workflowId:workflowid}};
            let url = `/spa/workflow/static4engine/engine.html#/main/workflowengine/path/codeMaintenance/addReserveCode?${buildUrlStr(createParams)}`;
            const dialog = WeaTools.createDialog({
                title: getLabel(22783,'新建预留号'),
                moduleName: "workflow",
                url: url,
                style: {width:600,height:600},
                callback: (datas) =>{
                },
                onCancel: () =>{
                }
            });
            dialog.show();
            this.setState({canAddFlag: true});
		});
    }
    syncTitleRequestMark(mark) {
        jQuery("#requestmarkSpan").text(mark);
    }
}